<template>
    <div class="app-container">
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo0" ref="enterpriseInfo0Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="账号信息" class="item-bottom" prop="userid">
                        <el-select v-model.number="enterpriseInfo0.userid" class="selectUser" :disabled="false">
                            <el-option v-for="item in noEnterpriseUserList" :key="item.userid" :label="item.username" :value="item.userid">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="企业网址" prop="website">
                        <el-input class="plainInput" v-model="enterpriseInfo0.website" :maxlength="100"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo1" ref="enterpriseInfo1Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="企业名称" prop="enterprisename">
                        <el-input class="plainInput" v-model="enterpriseInfo1.enterprisename" :maxlength="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="验证码数" prop="fakenumber" class="is-required">
                        <el-input class="plainInput" type="number" v-model="enterpriseInfo1.fakenumber" :maxlength="4"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo2" ref="enterpriseInfo2Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="联系方式" prop="enterprisephone">
                        <el-input class="plainInput" v-model="enterpriseInfo2.enterprisephone" :maxlength="11"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="8">
                    <el-form-item label="企业法人" prop="owner">
                        <el-input class="plainInput" v-model="enterpriseInfo2.owner" :maxlength="50"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo3" ref="enterpriseInfo3Form" :rules="rules">
                <el-col :xs="24" :sm="24" :md="24" :lg="20">
                    <el-form-item label="法定地址" prop="address">
                        <el-select v-model="province0" placeholder="请选择省" class="selectOther" :disabled="false">
                            <el-option v-for="item in position0.province.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="city0" placeholder="请选择市" class="selectOther" :disabled="false">
                            <el-option v-for="item in position0.city.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="county0" placeholder="请选择县" class="selectOther" :disabled="false">
                            <el-option v-for="item in position0.county.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="town0" placeholder="请选择镇" class="selectOther" :disabled="false">
                            <el-option v-for="item in position0.town.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-input class="detailAddr" v-model="enterpriseInfo3.address" prop="address"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo4" ref="enterpriseInfo4Form" :rules="rules">
                <el-col :xs="24" :sm="24" :md="24" :lg="20">
                    <el-form-item label="生产地址" prop="productionAddr">
                        <el-select v-model="province1" placeholder="请选择省" class="selectOther" :disabled="false">
                            <el-option v-for="item in position1.province.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="city1" placeholder="请选择市" class="selectOther" :disabled="false">
                            <el-option v-for="item in position1.city.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="county1" placeholder="请选择县" class="selectOther" :disabled="false">
                            <el-option v-for="item in position1.county.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-select v-model="town1" placeholder="请选择镇" class="selectOther" :disabled="false">
                            <el-option v-for="item in position1.town.list" :key="item.code" :label="item.name" :value="item.code">
                            </el-option>
                        </el-select>
                        <el-input class="detailAddr" v-model="enterpriseInfo4.productionAddr"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo5" ref="enterpriseInfo5Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="经营范围" prop="enterprisescope">
                        <el-input type="textarea" :rows="8" class="bussinessScope" v-model="enterpriseInfo5.scope" :maxlength="1024"></el-input>
                    </el-form-item>
                    <p class="textLenTips">
                        <el-form-item class="imgTipsItem">
                        {{ scopeTextLenTips ||'最多可录入1024个字符'}}
                    </el-form-item>
                    </p>                    
                </el-col>
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="营业执照">
                        <div class="businessLicense">
                            <el-upload class="avatar-uploader" :action="uploadUrl" :show-file-list="false" :on-success="handleLicenseSuccess" :before-upload="beforeAvatarUpload">
                                <img v-if="imageUrlLicense" :src="imageUrlLicense" class="avatar">
                                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                            </el-upload>
                        </div>
                    </el-form-item>
                    <p class="imgTips">
                        <el-form-item class="imgTipsItem">图片大小限制为2M,类型支持jpeg、png格式</el-form-item>
                    </p>                    
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo6" ref="enterpriseInfo6Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="服务信息" prop="serviceinformation">
                        <el-input type="textarea" :rows="8" class="bussinessScope" v-model="enterpriseInfo6.serviceinformation" :maxlength="1024"></el-input>
                    </el-form-item>
                    <p class="textLenTips">
                        <el-form-item class="imgTipsItem">
                        {{ serviceTextLenTips ||'最多可录入1024个字符'}}
                        </el-form-item>
                    </p>                    
                </el-col>
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="企业logo">
                        <div class="businessLicense">
                            <el-upload class="avatar-uploader" :action="uploadUrl" :show-file-list="false" :on-success="handleLogoSuccess" :before-upload="beforeAvatarUpload">
                                <img v-if="imageUrlLogo" :src="imageUrlLogo" class="avatar">
                                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                            </el-upload>
                        </div>
                    </el-form-item>
                    <p  class="imgTips">
                      <el-form-item class="imgTipsItem">图片大小限制为2M,类型支持jpeg、png格式</el-form-item>
                    </p>                    
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-form :inline="true" :model="enterpriseInfo7" ref="enterpriseInfo7Form" :rules="rules">
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="公司简介" prop="enterpriseprofile">
                        <el-input type="textarea" :rows="8" class="bussinessScope" v-model="enterpriseInfo7.enterpriseprofile" :maxlength="1024"></el-input>
                    </el-form-item>
                    <p  class="textLenTips">
                        <el-form-item class="imgTipsItem">
                            {{ profileTextLenTips || '最多可录入1024个字符'}}
                        </el-form-item>
                    </p>
                </el-col>
                <el-col :xs="24" :sm="12" :md="8" :lg="8">
                    <el-form-item label="宣传视频">
                        <div class="businessLicense">
                            <el-upload class="avatar-uploader" :action="uploadUrl" :show-file-list="false" :on-success="handleVideoSuccess" :before-upload="beforeVideoUpload">
                                <!-- <img v-if="imageUrlVideo" :src="imageUrlVideo" class="avatar"> -->
                                <video v-if="imageUrlVideo" :src="imageUrlVideo" autoplay="autoplay" controls="controls" class="vediocss">
                                    您的浏览器不支持 video 标签
                                </video>
                                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                            </el-upload>
                        </div>
                    </el-form-item>
                    <p class="imgTips">
                        <el-form-item class="imgTipsItem">视频大小限制为20M,类型支持MP4格式</el-form-item>
                    </p>
                </el-col>
            </el-form>
        </el-row>
        <el-row>
            <el-col :xs="24" :sm="12" :md="8" :lg="8">
                <div class='tips'>&nbsp;&nbsp;{{tips}}</div>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="8">
                <div class="operateBtn">
                    <el-button @click="saveEnterprise">
                        <icon-svg icon-class="baocun1"></icon-svg>&nbsp;&nbsp;保存</el-button>
                    <el-button @click="cancel">
                        <icon-svg icon-class="quxiao"></icon-svg>&nbsp;&nbsp;取消</el-button>
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<style scoped>
.selectOther {
    width: 130px;
}

.selectUser {
    width: 250px;
}

.detailAddr {
    width: 155px;
}

.plainInput {
    width: 250px;
}

.bussinessScope {
    width: 250px;
    overflow: auto;
    word-break: break-all;
}

.businessLicense {
    width: 256px;
    height: 180px;
    border: 1px dashed #d9d9d9;
}

.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.avatar-uploader .el-upload:hover {
    border-color: #20a0ff;
}

.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 250px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}

.avatar {
    width: 253px;
    height: 178px;
    display: block;
}

.operateBtn {
    text-align: center;
    margin: 0 auto;
}

.tips {
    font-size: 14px;
    color: red;
}

.vediocss {
    background-color: black;
    height: 178px;
    width: 250px;
}

.textLenTips {
    margin-top: -20px;
    margin-left: 65px;
    color: #bfcbd9;
    margin-bottom: 0px;
}

.imgTips {
    margin-top: -20px;
    margin-left: 67px;
    color: #bfcbd9;
}

.imgTipsItem {
    margin-bottom: 0px;
}

</style>

<script>
import { getNoEnterpriseUserList, saveEnterpriseInfo } from 'api/enterprise';
import { getPositionList } from 'api/system';
import { validateURL, validateTelno, validateFakeno } from 'utils/validate';
import Cookies from 'js-cookie';

export default {
    data() {
        // 效验防伪码数量
        const checkFakeNumber = (rule, value, callback) => {
            if (!value) {
                return callback(new Error('验证码数量不能为空'));
            }
            if (!validateFakeno(value)) {
                callback(new Error('允许数值范围为:1~9999'));
            } else {
                callback();
            }
        };
        // 效验企业网址
        const checkWebSite = (rule, value, callback) => {
            if (!validateURL(value) && value != '') {
                callback(new Error('请输入正确的网址'));
            } else {
                callback();
            }
        };

        // 效验联系电话
        const checkTelno = (rule, value, callback) => {
            if (!validateTelno(value) && value != '') {
                callback(new Error('请输入正确的手机号'));
            } else {
                callback();
            }
        };

        // 验证企业地址
        const checkAddr = (rule, value, callback) => {
            // setTimeout(() => {
            //     let v = value.length;
            //     if ((v < 0 || v > 40) && value != '') {
            //         callback(new Error('允许字符个数为:1~40'));
            //     } else {
            //         callback();
            //     }
            // }, 300);
            let v = value.length;
            if ((v < 0 || v > 100) && value != '') {
                callback(new Error('允许字符个数为:1~100'));
            } else {
                callback();
            }
        };

        // 效验企业用户
        const checkUserId = (rule, value, callback) => {
            if (!value) {
                return callback(new Error('请选择一个企业用户'));
            } else {
                callback();
            }
        }

        return {
            enterpriseInfo7: {
                enterpriseprofile: '',
                video: ''
            },
            enterpriseInfo6: {
                serviceinformation: '',
                logo: ''
            },
            enterpriseInfo5: {
                scope: '',
                businesslicense: ''
            },
            enterpriseInfo4: {
                productionaddressid: '',
                productionAddr: ''
            },
            enterpriseInfo3: {
                addressid: '',
                address: ''
            },
            enterpriseInfo2: {
                enterprisephone: '',
                owner: ''
            },
            enterpriseInfo1: {
                enterprisename: '',
                fakenumber: null
            },
            enterpriseInfo0: {
                userid: null,
                userType: '',
                website: ''
            },
            imageUrlLicense: '',
            imageUrlLogo: '',
            imageUrlVideo: '',
            tips: '',
            position0: {
                province: {
                    list: [],
                    isEnable: false
                },
                city: {
                    list: [],
                    isEnable: true
                },
                county: {
                    list: [],
                    isEnable: true
                },
                town: {
                    list: [],
                    isEnable: true
                },
                village: {
                    list: [],
                    isEnable: true
                }
            },
            position1: {
                province: {
                    list: [],
                    isEnable: false
                },
                city: {
                    list: [],
                    isEnable: true
                },
                county: {
                    list: [],
                    isEnable: true
                },
                town: {
                    list: [],
                    isEnable: true
                },
                village: {
                    list: [],
                    isEnable: true
                }
            },
            province0: '',
            city0: '',
            county0: '',
            town0: '',
            village0: '',
            province1: '',
            city1: '',
            county1: '',
            town1: '',
            village1: '',
            productType: [],
            positionCode: null,
            noEnterpriseUserList: [],
            uploadUrl: '',
            rules: {
                userid: [{ validator: checkUserId, trigger: 'blur' }],
                enterprisename: [{ required: true, message: '请输入企业名称', trigger: 'blur' },
                { min: 0, max: 40, message: '长度在 1 到 40 个字符', trigger: 'blur' }],
                fakenumber: [{ validator: checkFakeNumber, trigger: 'blur' }],
                website: [{ validator: checkWebSite, trigger: 'blur' }],
                enterprisephone: [{ validator: checkTelno, trigger: 'blur' }],
                owner: [{ min: 0, max: 40, message: '长度在 0 到 40 个字符', trigger: 'blur' }],
                address: [{ validator: checkAddr, trigger: 'blur' }],
                productionAddr: [{ validator: checkAddr, trigger: 'blur' }],
                serviceinformation: [{ min: 0, max: 1024, message: '长度在 0 到 1024 个字符', trigger: 'blur' }],
                enterprisescope: [{ min: 0, max: 1024, message: '长度在 0 到 1024 个字符', trigger: 'blur' }],
                enterpriseprofile: [{ min: 0, max: 1024, message: '长度在 0 到 1024 个字符', trigger: 'blur' }],
            },
            form0Valid: false,
            form1Valid: false,
            form2Valid: false,
            form3Valid: true,
            form4Valid: true,
            form5Valid: true,
            form6Valid: true,
            form7Valid: true,
            uploadUrl: 'trc-service-enterprise/enterprise/fileservice/upload?operatorid=' + Cookies.get('uid') + '&lastlogincode=' + Cookies.get('lastlogincode'),
            scopeTextLenTips: '',
            serviceTextLenTips: '',
            profileTextLenTips: ''
        }
    },
    created() {
        this.getPosition0(1);
        this.getPosition1(1);
        this.getNoEnterpriseUser();

    },
    watch: {
        province0() {
            this.getPosition0(2);
            this.position0.city.list = []; this.city0 = null;
            this.position0.county.list = []; this.county0 = null;
            this.position0.town.list = []; this.town0 = null;
        },
        city0() {
            this.getPosition0(3);
            this.position0.county.list = []; this.county0 = null;
            this.position0.town.list = []; this.town0 = null;
        },
        county0() {
            this.getPosition0(4);
            this.position0.town.list = []; this.town0 = null;
        },

        province1() {
            this.getPosition1(2);
            this.position1.city.list = []; this.city1 = null;
            this.position1.county.list = []; this.county1 = null;
            this.position1.town.list = []; this.town1 = null;
        },
        city1() {
            this.getPosition1(3);
            this.position1.county.list = []; this.county1 = null;
            this.position1.town.list = []; this.town1 = null;
        },
        county1() {
            this.getPosition1(4);
            this.position1.town.list = []; this.town1 = null;
        },
        'enterpriseInfo5.scope': function(val) {
            this.scopeTextLenTips = val.length + ' / 1024'
        },
        'enterpriseInfo6.serviceinformation': function(val) {
            this.serviceTextLenTips = val.length + ' / 1024'
        },
        'enterpriseInfo7.enterpriseprofile': function(val) {
            this.profileTextLenTips = val.length + ' / 1024'
        }
    },
    computed: {
        checkValidFlag: function() {
            return this.form0Valid && this.form1Valid && this.form2Valid && this.form3Valid
                && this.form4Valid && this.form5Valid && this.form6Valid && this.form7Valid
        }
    },
    methods: {
        getPosition0(level) {
            let pisCode = null;
            switch (level) {
                case 1: pisCode = null; break;
                case 2: pisCode = this.province0; break;
                case 3: pisCode = this.city0; break;
                case 4: pisCode = this.county0; break;
                default: break;
            };
            let parentcode = {
                parentcode: pisCode
            };
            getPositionList(parentcode).then(response => {
                let res = response.data;
                if (res.flag === 1) {
                    switch (level) {
                        case 1: this.position0.province.list = res.data; break;
                        case 2: this.position0.city.list = res.data; break;
                        case 3: this.position0.county.list = res.data; break;
                        case 4: this.position0.town.list = res.data; break;
                        default: break;
                    }
                }
            })
        },
        getPosition1(level) {
            let pisCode = null;
            switch (level) {
                case 1: pisCode = null; break;
                case 2: pisCode = this.province1; break;
                case 3: pisCode = this.city1; break;
                case 4: pisCode = this.county1; break;
                default: break;
            };
            let parentcode = {
                parentcode: pisCode
            };
            getPositionList(parentcode).then(response => {
                let res = response.data;
                if (res.flag === 1) {
                    switch (level) {
                        case 1: this.position1.province.list = res.data; break;
                        case 2: this.position1.city.list = res.data; break;
                        case 3: this.position1.county.list = res.data; break;
                        case 4: this.position1.town.list = res.data; break;
                        default: break;
                    }
                }
            })
        },
        getNoEnterpriseUser() {
            getNoEnterpriseUserList().then(response => {
                let res = response.data;
                if (res.flag === 1) {
                    this.noEnterpriseUserList = res.data;
                    // for (let i=0; i<this.noEnterpriseUserList.length; i++) {
                    //     this.noEnterpriseUserList[i].userid = this.noEnterpriseUserList[i].userid + ''
                    // }                    
                } else {
                    console.log('查询无关联企业用户失败.');
                }
            })
        },
        saveEnterprise() {

            let enterprise = {
                userid: this.enterpriseInfo0.userid || '',
                enterprisename: this.enterpriseInfo1.enterprisename || '',
                fakenumber: this.enterpriseInfo1.fakenumber || 0,
                enterprisephone: this.enterpriseInfo2.enterprisephone || '',
                owner: this.enterpriseInfo2.owner || '',
                addressid: this.town0 || this.county0 || this.city0 || this.province0 || '',
                address: this.enterpriseInfo3.address || '',
                productionaddressid: this.town1 || this.county1 || this.city || this.province1 || '',
                productionaddress: this.enterpriseInfo4.productionAddr || '',
                scope: this.enterpriseInfo5.scope || '',
                businesslicenseURL: this.imageUrlLicense || '',
                serviceinformation: this.enterpriseInfo6.serviceinformation || '',
                logoURL: this.imageUrlLogo || '',
                enterpriseprofile: this.enterpriseInfo7.enterpriseprofile || '',
                videoURL: this.imageUrlVideo || '',
                website: this.enterpriseInfo0.website || ''
            }

            this.$refs['enterpriseInfo0Form'].validate(valid => {
                if (valid) {
                    // form0效验成功                    
                    this.form0Valid = true
                } else {
                    console.log('form0效验失败.');
                    this.form0Valid = false
                }
            });

            this.$refs['enterpriseInfo1Form'].validate(valid => {
                if (valid) {
                    // form1效验成功                    
                    this.form1Valid = true
                } else {
                    console.log('form1效验失败.');
                    this.form1Valid = false
                }
            });

            this.$refs['enterpriseInfo2Form'].validate(valid => {
                if (valid) {
                    // form2效验成功                    
                    this.form2Valid = true
                } else {
                    console.log('form2效验失败.');
                    this.form2Valid = false
                }
            });

            this.$refs['enterpriseInfo3Form'].validate(valid => {
                if (valid) {
                    // form3效验成功                    
                    this.form3Valid = true
                } else {
                    console.log('form3效验失败.');
                    this.form3Valid = false
                }
            });

            this.$refs['enterpriseInfo4Form'].validate(valid => {
                if (valid) {
                    // form4效验成功                    
                    this.form4Valid = true
                } else {
                    console.log('form4效验失败.');
                    this.form4Valid = false
                }
            });

            this.$refs['enterpriseInfo5Form'].validate(valid => {
                if (valid) {
                    // form5效验成功                    
                    this.form5Valid = true
                } else {
                    console.log('form5效验失败.');
                    this.form5Valid = false
                }
            });


            this.$refs['enterpriseInfo6Form'].validate(valid => {
                if (valid) {
                    // form6效验成功                    
                    this.form6Valid = true
                } else {
                    console.log('form6效验失败.');
                    this.form6Valid = false
                }
            });

            this.$refs['enterpriseInfo7Form'].validate(valid => {
                if (valid) {
                    // form6效验成功                    
                    this.form7Valid = true
                } else {
                    console.log('form7效验失败.');
                    this.form7Valid = false
                }
            });

            if (this.checkValidFlag) {
                saveEnterpriseInfo(enterprise).then(response => {
                    let res = response.data;
                    if (res.flag === 1) {
                        this.tips = '企业信息新建成功';
                        this.$router.go(-1);
                    } else {
                        this.tips = '企业信息保存失败'
                    }
                })
            }
        },
        cancel() {
            this.$router.go(-1)
        },
        handleLicenseSuccess(res, file) {
            if (res.flag === 1) {
                this.enterpriseInfo5.businessLicense = res.data[0];
                this.imageUrlLicense = res.data[0];
            } else {
                console.log(res.message);
            }
            // this.imageUrl = URL.createObjectURL(file.raw);
        },
        handleLogoSuccess(res, file) {
            if (res.flag === 1) {
                this.enterpriseInfo6.logo = res.data[0];
                this.imageUrlLogo = res.data[0];
            } else {
                console.log(res.message);
            }
            // this.imageUrl = URL.createObjectURL(file.raw);
        },
        handleVideoSuccess(res, file) {
            if (res.flag === 1) {
                this.enterpriseInfo7.video = res.data[0];
                this.imageUrlVideo = res.data[0];
            } else {
                console.log(res.message);
            }
            // this.imageUrl = URL.createObjectURL(file.raw);
        },
        beforeAvatarUpload(file) {
            const isJPG = (file.type === 'image/jpeg') || (file.type === 'image/png');
            const isLt2M = file.size / 1024 / 1024 < 2;

            if (!isJPG) {
                this.$message.error('上传图片只能是jpeg、png格式');
            }
            if (!isLt2M) {
                this.$message.error('上传图片大小不能超过2MB');
            }
            return isJPG && isLt2M;
        },
        beforeVideoUpload(file) {
            const isMP4 = file.type === 'video/mp4';
            const isLt20M = file.size / 1024 / 1024 < 20;

            if (!isMP4) {
                this.$message.error('上传视频只能是MP4格式');
            }
            if (!isLt20M) {
                this.$message.error('上传视频大小不能超过20MB');
            }
            return isMP4 && isLt20M;
        }
    }
};
</script>